/* pages/home/home.wxss */
.page {
  position: relative;
  width: 100vw;
  height: 100vh;
  overflow-x: hidden;
  padding-bottom: 40rpx;
  display: flex;
  flex-direction: column;

  .bg {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: -1;
  }

  .conten {
    box-sizing: border-box;
    padding: 87.78rpx 50rpx 50rpx 50rpx;

    .navbar {
      margin: 74rpx auto 20rpx;
      display: flex;
      align-items: center;
      border-radius: 60rpx;
      overflow: hidden;
      box-sizing: border-box;
      border: 1rpx solid rgba(255, 255, 255, 0.5);
      background: rgba(255, 255, 255, 0.3);
      color: #fff;
      font-size: 25rpx;
      .nav {
        width: 50%;
        height: 60rpx;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 60rpx;
      }
      .nav-active {
        background: rgba(255, 255, 255, 0.7);
        color: rgb(33, 33, 87);
      }
    }

    .tit {
      color: rgb(255, 255, 255);
      font-family: 思源黑体 CN;
      font-size: 45rpx;
      font-weight: 350;
      line-height: 68rpx;
      letter-spacing: 3.6rpx;
      text-align: center;
    }

    .cartBox {
      width: 100%;
      padding: 10rpx 21.44rpx 10rpx 10rpx;
      box-sizing: border-box;
      border: 1px solid rgba(193, 193, 193, 0.5);
      background: rgba(255, 255, 255, 0.1);
      display: flex;
      position: relative;
      margin-bottom: 20rpx;

      &:last-child {
        margin-bottom: 0px;
      }

      .cartTop {
        width: 76rpx;
        position: absolute;
        top: 20rpx;
        left: -12rpx;
        z-index: 2;
      }

      .cartTop-1 {
        background: linear-gradient(
          137.7deg,
          rgb(255, 255, 255) 12.095%,
          rgb(152, 152, 152) 104.562%
        );
        color: rgb(116, 116, 116);
      }

      .cartTop-2 {
        background: linear-gradient(
          137.7deg,
          rgb(255, 247, 242) 12.095%,
          rgb(203, 146, 104) 104.562%
        );
        color: rgb(154, 98, 57);
      }

      .cartr {
        width: 160rpx;
        height: 160rpx;
        border-radius: 10rpx;
        overflow: hidden;
        position: relative;

        image {
          width: 160rpx;
          height: 160rpx;
        }
      }

      .cartl {
        padding-left: 25rpx;
        flex: 1;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        justify-content: center;

        .cartitBox {
          display: flex;
          justify-content: space-between;
          align-items: center;

          .cartTit {
            color: rgb(255, 255, 255);
            font-family: 思源黑体 CN;
            font-size: 28rpx;
            font-weight: 350;
            line-height: 42rpx;
            letter-spacing: 2.24rpx;
            text-align: left;
          }

          .cartdes {
            color: rgb(255, 255, 255);
            font-family: Helvetica;
            font-size: 24rpx;
            font-weight: 300;
            line-height: 24rpx;
            letter-spacing: 1.92rpx;
            text-align: right;
          }
        }

        .cartime {
          margin-top: 25.15rpx;
          display: flex;
          justify-content: space-between;

          .cartimel {
            color: rgb(255, 255, 255);
            font-family: Helvetica;
            font-size: 18rpx;
            font-weight: 300;
            line-height: 30rpx;
            letter-spacing: 1.44rpx;
            text-align: left;
          }

          .cartimer {
            width: 150rpx;
            margin-top: 22.33rpx;
          }
        }
      }
    }

    .disCartBox {
      background: rgba(255, 255, 255, 0.4);
    }
  }
}
.input-region {
  margin-bottom: 72rpx;
  color: #fff;
  line-height: 40rpx;
  display: flex;
  .clear{
    width: 34rpx;
    display: flex;
    align-items: center;
    padding-top: 10rpx;
    padding-left: 10rpx;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    image{
      width: 24rpx;
      height: 24rpx;
    }
  }
  .input-picker{
    display: flex;
    align-items: center;
  }
  .inputr {
    flex: 1;
    display: flex;
    align-items: flex-end;
    .input {
      flex: 1;
      font-size: 20rpx;
      color: rgba(255, 255, 255, 0.5);
    }
  }
  .input2box {
    display: flex;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
    padding: 0rpx 12rpx;
    height: 60rpx;
  }
  .inputit{
    font-size: 28rpx;
    margin-right: 17rpx;
    margin-bottom: 4rpx;
  }
  .inpuline{
    width: 1rpx;
    height: 24rpx;
    background-color: rgba(255, 255, 255, 0.5);
    margin-right: 20rpx;
    margin-bottom: 8rpx;
  }
}
